<?php include "../public/header.php";?>
<?php include '../public/header_index.php' ?>
<?php include "../public/header_show.php";?>
<style>
    .layui-col-space10{margin: unset!important;}
    .laytp-tree-table-cell.single-line > .laytp-tree-table-cell-content {overflow: unset!important;white-space: unset!important;text-overflow: unset!important;}
    #setauth_div{width: 200px;float: left;margin-left: 10px;margin-right: 5px}
    .setbut button{height: 35px!important;}
</style>
<body id="showPage">
    <div id="showBox">
        <div class="page-title">
            <div class="page-title-con">
                <span>角色详情</span>
                <div class="page-title-opt-list">
                    <button class="layui-btn layui-btn-sm btn-light marginr5 opt">操作<i class="layui-icon layui-icon-down layui-font-12"></i></button>
                    <span id="page-close" class="page-close" onclick="layer_close()">×</span>
                </div>
            </div>
        </div>

        <div class="main-container">
            <?php include "../public_flow/flow_show_tit.php";?>
            <div class="export-print">
                <div class="table-box">
                    <div class="title">
                        基本信息
                    </div>
                    <table class="layui-table table-detail">
                        <tbody>
                            <tr><td>角色名称</td><td id="name"></td><td>排序号</td><td id="sort"></td></tr>
                            <tr><td>最后更新人</td><td id="updated_user"></td><td>最后更新时间</td><td id="updated_at"></td></tr>
                            <tr><td>角色用户数量</td><td id="users" colspan="3"></td></tr>
                            <tr><td>角色用户明细</td><td id="userarr" colspan="3"></td></tr>
                            <tr><td>备注</td><td id="explain" colspan="3"></td></tr>
                        </tbody>
                    </table>
                </div>
            </div>

            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="table-box">
                        <div class="title-list">
                            权限信息
                            <span class="title-icon"><i class="layui-icon layui-icon-down"></i></span>
                        </div>
                        <div class="layui-card-body" style="padding-right: 10px;">
                            <table id="datalist_auth" lay-filter="datalist_auth"></table>
                        </div>
                    </div>
                </div>
            </div>

            <div class="opt-browse"><?php include '../public/opt_browse.php'?></div>
        </div>
        <div class="line"></div>
    </div>
<script>
    var param_id = getQueryVariable('id') || 0;

    layui.use(['form', 'layer', "laytp",'element','dropdown'], function() {
        var form = layui.form,element = layui.element;

        facade.ajax({url: ask_user_role_show, data:{id: param_id}}).done(function(res){
            if (res.code === 2000) {
                var data = res.data;
                $("#name").text(data.name);
                $("#sort").text(data.sort);
                $("#updated_user").text(data.updated_user);
                $("#updated_at").text(data.updated_at);
                $("#users").text(data.users);
                $("#explain").text(data.explain);

                var userArr = [];
                for (var key in data.userarr){
                    userArr.push(data.userarr[key].realname);
                }
                $("#userarr").text(userArr.join('，'));


                show_role_auth(data.data, data.dataAuth);
                $("#flow_show_tit .fshow_modenum").text('角色');
                render_from();
            }
        });

        public_get_readsandlog('user_role', param_id);
        showpage_dropopt();
    });


    function show_role_auth(treedata, dataAuth) {
        var tongStr = '<option value="">数据权限(统一设置)</option>';
        for (var key in dataAuth){
            tongStr += '<option value="'+key+'">'+dataAuth[key]+'</option>';
        }
        $("#setauth_dataauth").html(tongStr);

        layui.use(["tree", "laytp",'laypage','table','dropdown','form','soulTable','treeTable'], function () {
            var tree = layui.tree,laypage = layui.laypage, table = layui.table, dropdown = layui.dropdown,
                form = layui.form, soulTable = layui.soulTable, treeTable = layui.treeTable;

            // treeTable = $.extend(table, {config: {checkName: 'checked'}});
            mytable = treeTable.render({
                elem: "#datalist_auth",
                id: "datalist_auth",
                data: treedata,
                page: false,
                soulSort: TabInit.soulSort,
                method: 'GET',
                checkName: 'checked',
                toolbar: TabInit.toolbar,
                overflow: TabInit.overflow,
                defaultToolbar: ['', '', ''],
                filter: TabInit.filter,
                request: TabInit.request,
                response: TabInit.response
                ,treeDefaultClose: true
                , tree: {
                    iconIndex: 1        // 折叠图标显示在第几列
                    , arrowType: 'arrow2'   // 自定义箭头风格
                    , getIcon: function (d) {  // 自定义图标
                        if (d.children && d.children.length > 0) {  // 判断是否有子集
                            return '<i class="laytp-tree-icon laytp-tree-icon-folder"></i>';
                        } else {
                            return '<i class="laytp-tree-icon laytp-tree-icon-file"></i>';
                        }
                    }
                }
                ,parseData: function (res) {
                    return {
                        "code": res.code,
                        "msg": res.message,
                        "count": res.data.total,
                        "data": res.data.data
                    };
                }
                , cols: [[
                    {type: 'checkbox', fixed: 'left'}
                    ,{field: 'name', title: '菜单权限',width:400}
                    ,{field:'name',title:'数据权限',width:220,templet: function(d){
                            var str = '';
                            if(d.modedir){
                                for (var key in dataAuth){
                                    if(d.auth && d.auth == key){
                                        str = dataAuth[key];
                                    }
                                }
                            }
                            if(!str){
                                str = dataAuth[0];
                            }
                            return str;
                        }}
                    ,{field:'name',title:'操作权限',templet: function(d){
                            var str = '', allstr = '', but=d.but;
                            if(but && but.length > 0){
                                var allcheck = true;
                                for (var key in but){
                                    if(but[key].checked){
                                        str += '<input type="checkbox" class="but" disabled lay-filter="but" name="but" value="'+but[key].id+'" butkey="'+d.id+'" checked lay-skin="primary" title="'+but[key].title+'">';
                                    }else{
                                        allcheck = false;
                                        str += '<input type="checkbox" class="but" disabled lay-filter="but" name="but" value="'+but[key].id+'" butkey="'+d.id+'" lay-skin="primary" title="'+but[key].title+'">';
                                    }
                                }
                            }
                            return '<div class="trcheckbox">'+allstr+str+'</div>';
                        }}
                ]]
                , done: function (res) {
                    setTimeout(function () {
                        mytable.expandAll();
                        mytable.expandAll();
                    },100)


                    for (var aa in res) {
                        if(res[aa].checked){
                            $("tr[data-id='"+res[aa].id+"']").children('td:first-child').find('input[type="checkbox"]').prop('checked', true);
                            res[aa].LAY_CHECKED = true;
                        }

                        for (var bb in res[aa]['children']) {
                            if(res[aa]['children'][bb].checked){
                                $("tr[data-id='"+res[aa]['children'][bb].id+"']").children('td:first-child').find('input[type="checkbox"]').prop('checked', true);
                                res[aa]['children'][bb].LAY_CHECKED = true;
                            }

                            for (var cc in res[aa]['children'][bb]['children']) {
                                if(res[aa]['children'][bb]['children'][cc].checked){
                                    $("tr[data-id='"+res[aa]['children'][bb]['children'][cc].id+"']").children('td:first-child').find('input[type="checkbox"]').prop('checked', true);
                                    res[aa]['children'][bb]['children'][cc].LAY_CHECKED = true;
                                }
                            }
                        }
                    }

                    setTimeout(function () {
                        $('input[type="checkbox"]').prop('disabled', true);
                        $('input[type="checkbox"]').attr('disabled', true);
                        render_from();
                    },300)
                    $(".laytp-tree-table-tool").remove();
                }
            });
        });
    }
</script>
</body>
</html>
